<style lang='less' scoped>
/deep/ .ant-pro-basicLayout-content {
  margin: 0;
}

/deep/ .ant-layout-footer {
  padding: 0;
}

.bg-content {
  background: url("~@/assets/bgc.png");
  background-size: cover;
}

.extra-wrapper {
  line-height: 55px;
  padding-right: 24px;

  .extra-item {
    display: inline-block;
    margin-right: 24px;

    a {
      margin-left: 24px;
    }
  }
}

.antd-pro-pages-dashboard-analysis-twoColLayout {
  position: relative;
  display: flex;
  display: block;
  flex-flow: row wrap;
}

.antd-pro-pages-dashboard-analysis-salesCard {
  height: calc(100% - 24px);

  :deep(.ant-card-head) {
    position: relative;
  }
}

.dashboard-analysis-iconGroup {
  i {
    margin-left: 16px;
    color: rgba(0, 0, 0, .45);
    cursor: pointer;
    transition: color .32s;
    color: black;
  }
}

.analysis-salesTypeRadio {
  position: absolute;
  right: 54px;
  bottom: 12px;
}

.top {
  height: 100%;
  display: flex;
  justify-content: center;
  padding: 5px
}

.left-box {
  color: #fff;
}

.w-list {
  padding: 20px;

  p {
    padding: 10px 0;
    cursor: pointer;
  }
}

.w-list-2 {
  color: #fff;
  padding: 20px;
  position: relative;

  .passdateBox {
    position: absolute;
    right: 30px;
  }

  .right-title {
    cursor: pointer;
    margin-bottom: 10px;
  }

  .right-m-20 {
    margin-right: 20px;
  }

  .right-list {
    display: flex;
    flex-wrap: wrap;

    .right-item {
      width: 25%;
      height: 150px;

      .right-center {
        text-align: center;
        margin-bottom: 0;
      }

      .right-img {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 20px 20px 0;

        p {
          margin: 0;
          cursor: pointer;
        }

        img {
          width: 30px;
          cursor: pointer;
        }
      }
    }
  }
}

.group-box {
  height: 500px;
  overflow-y: scroll;
}

.group-list {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.group-item {
  background-color: #101619;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-left: 5%;
  padding-right: 5%;
  height: 50px;
  border-radius: 5px;

  .group-name {
    font-size: 20px;
    font-weight: bold;
    flex: 1;
    cursor: pointer;
  }

  .group-action {
    .group-action-icon {
      font-size: 20px;
      margin-right: 5px;
    }
  }
}

.device-list {
  color: #fff;
  padding-left: 5%;
  width: 100%;
  margin-bottom: 5px;
  // background-color: #0A5C91;
  .device-list-item {
    display: flex;
    height: 50px;
    align-items: center;
    justify-content: space-between;

    .device-name {
      font-size: 16px;
      margin-left: 10px;
    }

    .jindu {
      margin-left: 10px;
      width: 80px;
      height: 30px;
    }

    // 修改switch的宽高
    .my-switch.ant-switch {
      margin-left: 10px;
      min-width: 50px;
      height: 30px;

      // 修改字体大小
      .ant-switch-inner {
        font-size: 20px;
      }

      // 修改白色圆点大小
      &.ant-switch::after {
        width: 30px;
        height: 20px;
        top: 5px;
      }
    }

  }
}

.ant-switch-checked {
  background-color: #009944;
}

.action {
  display: flex;
  justify-content: flex-start;

  .action-item {
    width: 50%;
  }
}

.sorting-pages {
  margin-top: 40px;
  display: flex;
  justify-content: center;
  align-items: center;

  .item {
    background-color: #003567;
    border: 1px solid #fff;
    width: 80px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .total {
    margin-top: 20px;
  }
}
</style>

<template>
  <div>
    <a-row :gutter='48' class='bg-content' style='height: calc(100vh - 100px);display: flex'>
      <a-spin :spinning="spinning">
      <a-col style='flex:1;padding: 0'>
        <div class='top wbk'>
          <dv-border-box-1 class='left-box' style='width:400px;height:100%;'>
            <div class='w-list'>
              <p>设备列表</p>
              <div class='group-box'>
                <div class='group-list' v-for='(item,index) in deviceGroupList' :key='index'>
                  <div class='group-item'>
                    <div class='group-name'>{{ item.name }}</div>
                    <div class='group-action'>
                      <!--                      <a-icon type="form" class="group-action-icon" @click="groupEdit(item)"/>-->
<!--                      <a-icon type='delete' class='group-action-icon' @click='handleDeleteOk(item.id)' />-->
                      <!--                      <a-icon type="bars" class="group-action-icon" @click="changeShow(index)"/>-->
                    </div>
                  </div>
                  <div class='device-list'>
                    <div class='device-list-item' v-for='(k,d) in item.iotAlarmsList' :key='d'
                         :style="k.active ? { background: '#0A5C91' } : { background: 'none '}"
                         @click='changeShow(k, d)'>
                      <div class='device-name'>{{ k.alarmsName }}</div>
                      <!--                        <dv-percent-pond :config="config" class="jindu" />-->
                      <a-switch class='my-switch' />
                    </div>
                  </div>
                </div>
              </div>
              <div class='action'>
                <div class='action-item' @click='addDevice()'>添加设备</div>
                <div class='action-item' @click='addGroup()'>添加分组</div>
              </div>
              <div class='sorting-pages'>
                <div class='item' style='margin-right: 5px'>上一页</div>
                <div class='item'>下一页</div>
                <div class='total'>共123条</div>
              </div>
            </div>
          </dv-border-box-1>
          <dv-border-box-9>
            <div class='w-list-2'>
              <div class='right-title'>
                <span>设备名称: {{ selectInfo.alarmsName }}</span>
                <span class='right-m-20'>状态:在线</span>
                <a-button type='primary' style='margin-right: 10px' @click='deviceEdit()'>控制设备</a-button>
                <a-button type='primary' style='margin-right: 10px' @click='deviceRefresh()'>刷新</a-button>
              </div>
              <div class='right-list'>
<!--                v-for='(v, k, key) in deviceDetail' :key='key'-->
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>环境温度</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.ambientTemperature }} °C</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>太阳能充电量</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.chargingCapacity }} kw/h</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>充电电流</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.chargingCurrent }} A</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>充电功率</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.chargingPower }} W</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>太阳能电压</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.chargingVoltage }} V</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>放电电流</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.dischargeCurrent }} A</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>放电功率</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.dischargePower }} W</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>电池电压</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.dischargeVoltage }} V</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>系统温度</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.innerTemperature }} °C</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>LED电流</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.ledCurrent }} A</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>LED功率</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.ledPower }} W</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>LED电压</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.ledVoltage }} V</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>路灯电流</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.streetlightCurrent }} A</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>路灯功率</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.streetlightPower }} W</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>
                <dv-border-box-12 class='right-item' >
                  <p class='right-center' style='margin-top: 10px;color:#03afb2;font-weight: 600'>路灯电压</p>
                  <p class='right-center' style='font-size: 20px;font-weight: 600'>{{ deviceDetail.streetlightVoltage }} V</p>
                  <div class='right-img'>
                    <p>数据报表</p>
                    <img :src='refreshIcon' alt=''>
                  </div>
                </dv-border-box-12>

              </div>
              <div class='passdateBox'>
                <div class='newEquipment'>
                  <span>设备号:</span>
                  <span id='viewDeviceNumber'>{{ selectInfo.equipmentNo }}</span>
                </div>
                <div class='lookPass'>
                  <span>密码：</span>
                  <span id='passShow' style='display: none'></span>
                  <span id='passNone'> {{ selectInfo.password }}</span>
                  <span class='iconfont icon-chakanmima2' id='NewPass'></span>
                </div>
                <div class='equipmentDate'>数据时间: {{ selectInfo.collectTime }}</div>
                <div class='equipmentJumpDate'>心跳时间: {{ selectInfo.collectTime }}</div>
                <div class='createTime'>添加时间: {{ selectInfo.updateTime }}</div>
              </div>
            </div>
          </dv-border-box-9>
        </div>
      </a-col>
      </a-spin>
    </a-row>
    <create-group
      ref='createGroup'
      :title='grouptitle'
      :visible='visible'
      :loading='confirmLoading'
      :model='mdl'
      @cancel='handleCancel'
      @ok='handleOk'
    />

    <create-form
      ref='createForm'
      :title='devicetitle'
      :visible='visible2'
      :loading='confirmLoading2'
      :model='mdl2'
      @cancel='handleCancel2'
      @ok='handleOk2'
    />

    <create-item
      ref='createItem'
      :title='devicetitle'
      :visible='visible3'
      :loading='confirmLoading3'
      :model='mdl3'
      @cancel='handleCancel3'
      @ok='handleOk3'
    />
  </div>
</template>
<script>
import moment from 'moment'
import refreshIcon from '@/assets/refresh.png'
import {
  getAlarmData,
  getDeviceList,
  createDevice,
  deleteDevice,
  updateDevice,
  createDeviceGroup,
  deleteDeviceGroup,
  updateDeviceGroup,
  GetDevice,
  detailDevice,
  getDeviceGroupList,
  createDeviceSetting, createDeviceNew
} from '@/api/device'
import CreateGroup from '@/views/device/modules/CreateGroup.vue'
import CreateForm from '@/views/device/modules/CreateForm.vue'
import CreateItem from '@/views/photovoltaic/CreateItem.vue'
import {
  ChartCard,
  MiniArea,
  MiniBar,
  MiniProgress,
  RankList,
  Bar,
  Trend,
  NumberInfo,
  MiniSmoothArea
} from '@/components'
import { baseMixin } from '@/store/app-mixin'

const barData = []
const barData2 = []
for (let i = 0; i < 12; i += 1) {
  barData.push({
    x: `${i + 1}月`,
    y: Math.floor(Math.random() * 1000) + 200
  })
  barData2.push({
    x: `${i + 1}月`,
    y: Math.floor(Math.random() * 1000) + 200
  })
}

const rankList = []
for (let i = 0; i < 7; i++) {
  rankList.push({
    name: '白鹭岛 ' + (i + 1) + ' 号店',
    total: 1234.56 - i * 100
  })
}

const searchUserData = []
for (let i = 0; i < 7; i++) {
  searchUserData.push({
    x: moment().add(i, 'days').format('YYYY-MM-DD'),
    y: Math.ceil(Math.random() * 10)
  })
}
const searchUserScale = [
  {
    dataKey: 'x',
    alias: '时间'
  },
  {
    dataKey: 'y',
    alias: '用户数',
    min: 0,
    max: 10
  }]

const searchData = []
for (let i = 0; i < 50; i += 1) {
  searchData.push({
    index: i + 1,
    keyword: `搜索关键词-${i}`,
    count: Math.floor(Math.random() * 1000),
    range: Math.floor(Math.random() * 100),
    status: Math.floor((Math.random() * 10) % 2)
  })
}

const DataSet = require('@antv/data-set')

const sourceData = [
  { item: '家用电器', count: 32.2 },
  { item: '食用酒水', count: 21 },
  { item: '个护健康', count: 17 },
  { item: '服饰箱包', count: 13 },
  { item: '母婴产品', count: 9 },
  { item: '其他', count: 7.8 }
]

const pieScale = [{
  dataKey: 'percent',
  min: 0,
  formatter: '.0%'
}]

const dv = new DataSet.View().source(sourceData)
dv.transform({
  type: 'percent',
  field: 'count',
  dimension: 'item',
  as: 'percent'
})
const pieData = dv.rows

export default {
  name: 'Analysis',
  mixins: [baseMixin],
  components: {
    ChartCard,
    MiniArea,
    MiniBar,
    MiniProgress,
    RankList,
    Bar,
    Trend,
    NumberInfo,
    MiniSmoothArea,
    CreateGroup,
    CreateForm,
    CreateItem
  },
  data() {
    return {
      spinning: false,
      config: {},
      listObjectEnum: {
        ambientTemperature: '环境温度',
        chargingCapacity: '太阳能充电量',
        chargingCurrent: '充电电流',
        chargingPower: '充电功率',
        chargingVoltage: '太阳能电压',
        dischargeCurrent: '放电电流',
        dischargePower: '放电功率',
        dischargeVoltage: '电池电压',
        innerTemperature: '系统温度',
        ledCurrent: 'LED电流',
        ledPower: 'LED功率',
        ledVoltage: 'LED电压',
        streetlightCurrent: '路灯电流',
        streetlightPower: '路灯功率',
        streetlightVoltage: '路灯电压',
      },
      listObjectUtilEnum: {
        ambientTemperature: '°C',
        chargingCapacity: 'kw/h',
        chargingCurrent: 'A',
        chargingPower: 'W',
        chargingVoltage: 'V',
        dischargeCurrent: 'A',
        dischargePower: 'W',
        dischargeVoltage: 'V',
        innerTemperature: '°C',
        ledCurrent: 'A',
        ledPower: 'W',
        ledVoltage: 'V',
        streetlightCurrent: 'A',
        streetlightPower: 'W',
        streetlightVoltage: 'V',
      },
      // create model
      visible: false,
      confirmLoading: false,
      mdl: null,
      grouptitle: '',
      device_id: 1,
      // create model
      visible2: false,
      confirmLoading2: false,
      mdl2: null,
      oldMd2: null,
      visible3: false,
      confirmLoading3: false,
      mdl3: null,
      devicetitle: '',

      loading: true,
      refreshIcon,
      rankList,

      // 搜索用户数
      searchUserData,
      searchUserScale,
      searchData,

      barData,
      barData2,

      //
      pieScale,
      pieData,
      sourceData,
      pieStyle: {
        stroke: '#fff',
        lineWidth: 1
      },
      ambientTemperature: 0,
      chargingCapacity: 0,
      chargingCurrent: 0,
      chargingPower: 0,
      chargingVoltage: 0,
      dischargeCurrent: 0,
      dischargePower: 0,
      dischargeVoltage: 0,
      innerTemperature: 0,
      ledCurrent: 0,
      ledPower: 0,
      ledVoltage: 0,
      streetlightVoltage: 0,
      equipmentNo: '',
      deviceGroupList: [],
      deviceDetail: {
        ambientTemperature: 0,
        chargingCapacity: 0,
        chargingCurrent: 0,
        chargingPower: 0,
        chargingVoltage: 0,
        dischargeCurrent: 0,
        dischargePower: 0,
        dischargeVoltage: 0,
        innerTemperature: 0,
        ledCurrent: 0,
        ledPower: 0,
        ledVoltage: 0,
        streetlightCurrent: 0,
        streetlightPower: 0,
        streetlightVoltage: 0
      },
      selectInfo: {},
      selectIndex: null
    }
  },
  computed: {
    searchTableColumns() {
      return [
        {
          dataIndex: 'index',
          title: this.$t('dashboard.analysis.table.rank'),
          width: 90
        },
        {
          dataIndex: 'keyword',
          title: this.$t('dashboard.analysis.table.search-keyword')
        },
        {
          dataIndex: 'count',
          title: this.$t('dashboard.analysis.table.users')
        },
        {
          dataIndex: 'range',
          title: this.$t('dashboard.analysis.table.weekly-range'),
          align: 'right',
          sorter: (a, b) => a.range - b.range,
          scopedSlots: { customRender: 'range' }
        }
      ]
    }
  },
  created() {
    setTimeout(() => {
      this.loading = !this.loading
    }, 1000)
    this.initList()
  },
  methods: {
    GetDevice() {
      GetDevice(this.device_id).then((res) => {
        this.mdl2 = res.data
        this.oldMd2 = JSON.parse(JSON.stringify(res.data))
      })
    },
    getIotAlarmsList() {

    },
    initList() {
      const params = {
        pageNum: 1,
        pageSize: 10
      }
      getDeviceGroupList(params).then(res => {
        console.log(res.data.list)
        res.data.list.forEach((element) => {
          element.isshow = false
        })
        this.deviceGroupList = res.data.list

        console.log('123', this.deviceGroupList)
      })
    },
    getAlarmData(equipmentNo) {
      var params = {
        equipmentNo: equipmentNo
      }
      getAlarmData(params).then(res => {
        this.model = res.data
      })
    },

    getDeviceList() {
      var params = {
        equipmentNo: this.equipmentNo
      }
      getDeviceList(params).then(res => {
      })
    },
    async changeShow(k, d) {
      // if(k.active) {
      //   k.active = false
      // } else {
      //   k.active = true
      // }
      this.spinning = true
      try {
        this.selectInfo = k
        const res = await detailDevice(k.id)
        this.spinning = false
        console.log('res========', res.data)
        this.mdl2 = res.data
        console.log(this.mdl2)
        if (res.data.alarmsData) {
          this.deviceDetail = res.data.alarmsData
        }

      } catch (e) {
        this.spinning = false
      }

    },
    groupEdit(obj) {
      this.visible = true
      this.grouptitle = '修改分组'
      // this.mdl={
      //   id:1,
      //   name:obj.name
      // }
      this.mdl = {
        id: 1,
        name: '分组1'
      }
    },
    groupDelete() {

    },
    addGroup() {
      this.visible = true
      this.grouptitle = '添加分组'
    },
    handleOk() {

      const form = this.$refs.createGroup.form
      this.confirmLoading = true
      form.validateFields((errors, values) => {
        if (!errors) {
          console.log('values', values)
          if (values.id > 0) {
            updateDeviceGroup(values).then(res => {
              console.log('res', res)
              this.visible = false
              this.confirmLoading = false
              // // 重置表单数据
              // form.resetFields()
              // // 刷新表格
              // this.$refs.table.refresh()
              if (res.code == 200) {
                this.$message.info('修改成功')
              } else {
                this.$message.info(res.message)
              }
            })
          } else {
            // 新增
            createDeviceGroup(values).then(res => {
              console.log('res', res)
              this.visible = false
              this.confirmLoading = false
              // // 重置表单数据
              // form.resetFields()
              // // 刷新表格
              // this.$refs.table.refresh()
              if (res.code == 200) {
                this.$message.info('新增成功')
              } else {
                this.$message.info(res.message)
              }
            })
          }
        } else {
          this.confirmLoading = false
        }
      })
    },
    handleCancel() {
      this.visible = false

      const form = this.$refs.createModal.form
      form.resetFields() // 清理表单数据（可不做）
    },

    handleDeleteOk(id) {
      var that = this
      this.$confirm({
        title: '确认要删除吗',
        onOk() {
          deleteDevice(id).then(res => {
            if (res.code == 200) {
              // 刷新表格
              that.$refs.table.refresh(true)
              that.$message.info('删除成功')
            } else {
              that.$message.info(res.message)
            }
          })
        },
        onCancel() {
        }
      })
    },

    addDevice() {
      this.visible3 = true
      this.devicetitle = '添加设备'
    },
    handleOk3() {
      console.log('11111111111')
      const form = this.$refs.createItem.form
      this.confirmLoading3 = true;
      createDevice(form.getFieldsValue()).then(res => {
        console.log('res', res)
        this.visible3 = false
        this.confirmLoading3 = false
        // // 重置表单数据
        // form.resetFields()
        // // 刷新表格
        // this.$refs.table.refresh()
        if (res.code == 200) {
          this.$message.info('新增成功')
          this.initList()
        } else {
          this.$message.info(res.message)
        }
      })
    },
    deviceEdit() {
      this.devicetitle = '设备参数控制'
      this.visible2 = true
    },
    async deviceRefresh() {
      this.spinning = true
      try {
        const res = await detailDevice(this.selectInfo.id)
        this.spinning = false
        console.log('res========', res.data)
        this.mdl2 = res.data
        console.log(this.mdl2)
        if (res.data.alarmsData) {
          this.deviceDetail = res.data.alarmsData
        }
      } catch (e) {
        this.spinning = false
      }

    },
    handleOk2() {
      const form = this.$refs.createForm.form
      this.confirmLoading2 = true
      console.log(this.mdl2)
      console.log('form', form)
      const params = {
        equipmentNo: this.mdl2.equipmentNo,
        camera: this.mdl2.camera,
        charge: this.mdl2.charge,
        led: this.mdl2.led,
        ledlum: this.mdl2.ledlum,
        light: this.mdl2.light,
        lightLitlum: this.mdl2.lightLitlum,
        sw: this.mdl2.sw,
        swTime: this.mdl2.swTime,
        ledCloseTime: this.mdl2.ledCloseTime,
        ledOpenTime: this.mdl2.ledOpenTime,
      }
      for (let key in params) {
        if (key !== 'equipmentNo') {
          // 判断是不是布尔类型 是就转成字符串再判断
          if (params[key] === this.oldMd2[key]) {
            delete params[key]
          }
        }
      }
        createDeviceNew(params).then(res => {
          console.log('res', res)
          this.visible2 = false
          this.confirmLoading2 = false
          if (res.code == 200) {
            this.$message.info('修改成功')
            this.initList()
            this.changeShow(this.selectInfo)
          } else {
            this.$message.info(res.message)
          }
        })
    },
    handleCancel2() {
      this.visible2 = false

      const form = this.$refs.createModal.form
      form.resetFields() // 清理表单数据（可不做）
    },
    handleCancel3() {
      this.visible3 = false
      const form = this.$refs.createItem.form
      form.resetFields() // 清理表单数据（可不做）
    }
  }
}
</script>

